﻿<phone:PhoneApplicationPage x:Class="ContosoSocial.MainPage"
                            xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                            xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                            xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
                            xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
                            xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
                            xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
                            xmlns:converters="clr-namespace:ContosoSocial.Converters"
                            mc:Ignorable="d"
                            FontFamily="{StaticResource PhoneFontFamilyNormal}"
                            FontSize="{StaticResource PhoneFontSizeNormal}"
                            Foreground="{StaticResource PhoneForegroundBrush}"
                            SupportedOrientations="Portrait"
                            Orientation="Portrait"
                            shell:SystemTray.IsVisible="True"
							shell:SystemTray.Opacity="0"
                            shell:SystemTray.ForegroundColor="#FF272727">
    <shell:SystemTray.ProgressIndicator>
        <shell:ProgressIndicator Text="{Binding ProgressText}"
                                 IsIndeterminate="{Binding ProgressIsVisible}"
                                 IsVisible="{Binding ProgressIsVisible}"/>
    </shell:SystemTray.ProgressIndicator>

    <phone:PhoneApplicationPage.Resources>
        <converters:NullVisibilityConverter x:Key="NullVisibilityConverter" />
        <converters:NullVisibilityConverter x:Key="InvertedNullVisibilityConverter"
                                            Inverted="True" />

        <Style x:Key="ButtonStyle1"
               TargetType="Button">
            <Setter Property="Background"
                    Value="Transparent" />
            <Setter Property="BorderBrush"
                    Value="{StaticResource PhoneForegroundBrush}" />
            <Setter Property="Foreground"
                    Value="{StaticResource PhoneForegroundBrush}" />
            <Setter Property="BorderThickness"
                    Value="{StaticResource PhoneBorderThickness}" />
            <Setter Property="FontFamily"
                    Value="{StaticResource PhoneFontFamilySemiBold}" />
            <Setter Property="FontSize"
                    Value="{StaticResource PhoneFontSizeMedium}" />
            <Setter Property="Padding"
                    Value="10,5,10,6" />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Grid Background="Transparent">
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="CommonStates">
                                    <VisualState x:Name="Normal" />
                                    <VisualState x:Name="MouseOver" />
                                    <VisualState x:Name="Pressed">
                                        <Storyboard>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground"
                                                                           Storyboard.TargetName="ContentContainer">
                                                <DiscreteObjectKeyFrame KeyTime="0"
                                                                        Value="{StaticResource PhoneButtonBasePressedForegroundBrush}" />
                                            </ObjectAnimationUsingKeyFrames>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background"
                                                                           Storyboard.TargetName="ButtonBackground">
                                                <DiscreteObjectKeyFrame KeyTime="0">
                                                    <DiscreteObjectKeyFrame.Value>
                                                        <SolidColorBrush Color="#FF29406B" />
                                                    </DiscreteObjectKeyFrame.Value>
                                                </DiscreteObjectKeyFrame>
                                            </ObjectAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Disabled">
                                        <Storyboard>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground"
                                                                           Storyboard.TargetName="ContentContainer">
                                                <DiscreteObjectKeyFrame KeyTime="0"
                                                                        Value="{StaticResource PhoneDisabledBrush}" />
                                            </ObjectAnimationUsingKeyFrames>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush"
                                                                           Storyboard.TargetName="ButtonBackground">
                                                <DiscreteObjectKeyFrame KeyTime="0"
                                                                        Value="{StaticResource PhoneDisabledBrush}" />
                                            </ObjectAnimationUsingKeyFrames>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background"
                                                                           Storyboard.TargetName="ButtonBackground">
                                                <DiscreteObjectKeyFrame KeyTime="0"
                                                                        Value="Transparent" />
                                            </ObjectAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                </VisualStateGroup>
                                <VisualStateGroup x:Name="FocusStates" />
                            </VisualStateManager.VisualStateGroups>
                            <Border x:Name="ButtonBackground"
                                    BorderBrush="{TemplateBinding BorderBrush}"
                                    BorderThickness="{TemplateBinding BorderThickness}"
                                    Background="{TemplateBinding Background}"
                                    CornerRadius="2"
                                    Margin="{StaticResource PhoneTouchTargetOverhang}">
                                <ContentControl x:Name="ContentContainer"
                                                ContentTemplate="{TemplateBinding ContentTemplate}"
                                                Content="{TemplateBinding Content}"
                                                Foreground="{TemplateBinding Foreground}"
                                                HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
                                                Padding="{TemplateBinding Padding}"
                                                VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" />
                            </Border>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

    </phone:PhoneApplicationPage.Resources>

    <!--LayoutRoot is the root grid where all page content is placed-->
    <Grid x:Name="LayoutRoot"
          Background="#FFEFEFEF">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>

        <!--TitlePanel contains the name of the application and page title-->
        <StackPanel x:Name="TitlePanel"
                    Grid.Row="0"
                    Margin="12,110,12,0"
                    VerticalAlignment="Bottom"
                    Visibility="{Binding CurrentUser, Converter={StaticResource InvertedNullVisibilityConverter}}">
            <Image Height="100" Source="/Assets/Images/Logo.png"/>
            <TextBlock Style="{StaticResource PhoneTextNormalStyle}"
                       Margin="12,2,12,0"
                       Foreground="#FF272727"
                       HorizontalAlignment="Center"
                       Text="It's easy to get started. Just sign in with Facebook to get access."
                       TextAlignment="Center"
                       Width="316"
                       TextWrapping="Wrap" />
        </StackPanel>

        <!--ContentPanel - place additional content here-->
        <StackPanel x:Name="ContentPanel"
                    Grid.Row="1"
                    Margin="12,24,12,0">
            <Button VerticalAlignment="Top"
                    Foreground="White"
                    BorderBrush="#3B5998"
                    Background="#3B5998"
                    Click="LoginButtonClick"
                    Padding="0"
                    Height="74"
                    x:Name="LoginButton"
                    Visibility="{Binding CurrentUser, Converter={StaticResource InvertedNullVisibilityConverter}}"
                    HorizontalAlignment="Center"
                    Width="306"
                    Margin="0,12,0,0"
                    Style="{StaticResource ButtonStyle1}"
                    BorderThickness="0">
                <StackPanel Orientation="Horizontal"
                            HorizontalAlignment="Left"
                            Margin="1,0,0,0">
                    <Image Source="/Assets/Images/FBLogoWhite.png"
                           Width="35"
                           Margin="0,0,12,0" />
                    <TextBlock Text="Sign in with Facebook"
                               VerticalAlignment="Center"
                               FontFamily="Segoe WP Semibold"
                               FontSize="21.333" />
                </StackPanel>
            </Button>
        </StackPanel>

        <StackPanel Orientation="Vertical"
        	Visibility="{Binding CurrentUser, Converter={StaticResource NullVisibilityConverter}}" Margin="24,70,24,0" Grid.RowSpan="2">
            <StackPanel Margin="0" Orientation="Vertical">
                <StackPanel Margin="0,0,0,36" Orientation="Horizontal" HorizontalAlignment="Center">
                    <Image Height="45" Source="/Assets/Images/Logo.png" Width="45"/>
                    <TextBlock
        				Text="Contoso Social"
        				Style="{StaticResource PhoneTextTitle1Style}"
        				VerticalAlignment="Center"
        				Foreground="#FFFAD114"
        				FontSize="21.333"
        				HorizontalAlignment="Center"
        				FontFamily="Segoe WP Semibold" Margin="6,0,0,0" FontWeight="Bold" />
                </StackPanel>
                <TextBlock x:Name="LoggedInAs"
        			Text="{Binding CurrentUser.Name}"
        			Style="{StaticResource PhoneTextTitle1Style}"
        			VerticalAlignment="Top"
        			Foreground="#FF272727"
        			FontSize="24"
        			HorizontalAlignment="Center"
        			FontFamily="Segoe WP Semibold" Margin="0" />
            </StackPanel>
            <Grid HorizontalAlignment="Center" Margin="0,12,0,0">
                <Grid.RowDefinitions>
                    <RowDefinition/>
                </Grid.RowDefinitions>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="Auto"/>
                    <ColumnDefinition Width="*"/>
                </Grid.ColumnDefinitions>
                <Ellipse HorizontalAlignment="Left" Height="75" VerticalAlignment="Top" Width="75" Margin="0">
                    <Ellipse.Fill>
                        <ImageBrush Stretch="UniformToFill" ImageSource="{Binding CurrentUser.ProfilePictureUrl}" />
                    </Ellipse.Fill>
                </Ellipse>

                <TextBlock x:Name="StatusText"
                           Style="{StaticResource PhoneTextNormalStyle}"
                           TextWrapping="Wrap"
                           Grid.Column="1"
                           Foreground="Black"
                           VerticalAlignment="Top"/>
            </Grid>

            <TextBox x:Name="UpdateStatusBox"
                     Background="White"
                     BorderBrush="#FF747474"
                     SelectionForeground="White"
                     SelectionBackground="#FFB0B0B0"
                     BorderThickness="1"
                     Foreground="#FF272727"
                     Margin="0,24,0,0" />
            <Button Content="update status"
                    x:Name="UpdateStatusButton"
                    Click="UpdateStatusButton_OnClick"
                    Foreground="White"
                    BorderBrush="Black"
                    Style="{StaticResource ButtonStyle1}"
                    BorderThickness="0"
                    Height="78"
                    Background="#FFFAD114"
                    Margin="0,-12,0,0" />

            <Button Content="logout"
        		VerticalAlignment="Top"
        		Click="LogoutClick"
        		x:Name="LogOutButton"
        		BorderBrush="Black"
        		Foreground="White"
        		BorderThickness="0"
        		Height="78"
        		Style="{StaticResource ButtonStyle1}" Background="#FFACACAC" Margin="0,12,0,0" />

            <TextBlock x:Name="ExpiryText"
                       Style="{StaticResource PhoneTextSubtleStyle}"
                       Foreground="#FF999999" />
        </StackPanel>

    </Grid>

</phone:PhoneApplicationPage>